import React, { Component } from 'react'
import MovieList from './views/MovieList'

export default class App extends Component {
  constructor(){
    super()
    this.state={
      type:0,
      list:['热映电影','即将上映']
    }
  }
  change=(arg)=>{
    switch(arg){
      case '热映电影':
        this.setState({list:this.state.list,type:1})
        break
      case '即将上映':
        this.setState({list:this.state.list,type:2})
        break
    }
  }
  render() {
    let styleObj={margin:'10px',background:'#ccc',border:'none',width:'100px',height:'40px'}
    return (
      <div>
         <div>
            {
              this.state.list.map(item=><button 
                          style={styleObj} 
                          key={item}
                          onClick={()=>{this.change(item)}}>
                            {item}
                        </button>)
            }
         </div>
         <div>
            <MovieList type={this.state.type}></MovieList>
         </div>
      </div>
    )
  }
}
